let ulbox = document.querySelector(".ulbox");
let title = document.querySelector(".title")
let titleIdArr = [];




const xhr1 = new XMLHttpRequest();
xhr1.open("get","http://chst.vip:1234/api/getcategorytitle",false);
xhr1.onload = function(){
    if(xhr1.status === 200){
        let res1 = JSON.parse(xhr1.responseText);
        // console.log(res1);
        // console.log(res1.result);

        let tis = "";
        res1.result.forEach(item => {
            tis += `<li>
                    <div class="title">
                    <p>${item.title}</p>
                    <span>▼</span>
                    </div>
                    <div class="content">
                    
                    </div>

                </li>`
            titleIdArr.push(item.titleId);
        });
        ulbox.innerHTML = tis;
        
    }
}

xhr1.send(null);

let content = document.querySelectorAll(".content");
titleIdArr.forEach((item,index)=>{
    const xhr2 = new XMLHttpRequest();
    xhr2.open("get",`http://chst.vip:1234/api/getcategory?titleid=${item}`,false);
    xhr2.onload = function(){
        if(xhr2.status === 200){
            let res2 = JSON.parse(xhr2.responseText);
            // console.log(res2);
            console.log(res2.result);

            let ps = "";
            res2.result.forEach(value => {
                ps += `<p id="${value.categoryId}">${value.category}</p>`
            })
            content[index].innerHTML = ps;
        }
    }
    xhr2.send(null);


    $('.content>p').click(function(ev){
        let e = ev || window.event;
        let target = e.target || e.srcElement;
        console.log(target.nodeName);
        let ID ;
        if(target.nodeName === "P"){
            ID = target.id
        }else{
            ID = target.parentNode.id;
    
        }
        // console.log($(this));
        location.href = "../html/product.html?categoryId="+ID;

        localStorage.setItem("pbox",target.innerHTML);
    }) 
})


$(".ulbox>li>.content").slideUp(0,function(){
    $(this).prop("flag",false);
});

$(".ulbox>li").click(function(){
    $(this).find(".content").slideToggle().parent().siblings().find(".content").slideUp();
})

